<template>
    <tr>
      <td v-show =" !is_edit">{{course.courseId}}</td>
      <td v-show ="!is_edit">{{course.courseName}}</td>
      <td v-show ="!is_edit">{{course.courseType}}</td>
      <td v-show ="!is_edit">{{course.courseDescription}}</td>
  <!--    <td v-show ="!is_edit">{{course.math}}</td>-->
  <!--    <td v-show ="!is_edit">{{course.eng}}</td>-->
  <!--    <td v-show ="!is_edit">{{course.place}}</td>-->
      <td v-show ="!is_edit">
        <el-button type="primary" @click ="modify">修改</el-button>
      </td>
      <td v-show ="!is_edit">
        <el-button type="danger" @click="deleteCourse">删除</el-button>
      </td>
      <td v-show ="is_edit"><input class="w-50" type="text" v-model="course.courseId"></td>
      <td v-show ="is_edit"><input class="w-50" type="text" v-model="course.courseName"></td>
      <td v-show ="is_edit"><input class="w-10" type="text" v-model="course.courseType"></td>
      <td v-show ="is_edit"><input class="w-10" type="text" v-model="course.courseDescription"></td>
  <!--    <td v-show ="is_edit"><input class="w-50" type="text" v-model.number="course.math"></td>-->
  <!--    <td v-show ="is_edit"><input class="w-50" type="text" v-model.number="course.eng"></td>-->
  <!--    <td v-show ="is_edit"><input class="w-50" type="text" v-model="course.place"></td>-->
      <td v-show ="is_edit">
        <el-button type="primary" @click="save" >保存</el-button>
      </td>
      <td v-show ="is_edit">
        <el-button type="danger">删除</el-button>
      </td>
    </tr>
  </template>
  <script>
  import axios from "axios";
  export default {
    props:["course"],
    data(){
      return{
        is_edit:false
      }
    },
    methods:{
      modify(){
        this.is_edit= true;
      },
      save(){
        axios({
          url:"http://localhost:8080/update",
          method:'POST',
          data:this.course
        })
        this.is_edit= false;
      },
      deleteCourse(){
        axios({
          url:"http://localhost:8080/delete",
          method:'POST',
          data:this.course
        })
        location.reload();
      }
    }
  }
  </script>
  
  <style>
  
  </style>
  